<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
        <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
        <link rel="stylesheet" href="https://static.91haoka.cn/vant.css"/>
        <script src="https://static.91haoka.cn/vue.min.js"></script>
        <script src="https://static.91haoka.cn/vantall.js"></script>
        <script src="https://static.91haoka.cn/axios.min.js"></script>
		<link rel="stylesheet" type="text/css" href="https://static.91haoka.cn/all.css"/>
     </head>
    <style type="text/css">
		*{ box-sizing: border-box; font-family:'PingFang SC'; font-size: 12px;}
		img{ max-width: 100%;}
		.kflexbc{ display: flex; justify-content: space-between; align-items: center; }
		.kflexc{ display: flex; align-items: center; }
		.kflexcc{ display: flex; align-items: center; justify-content: center;}
		.kflex{ display: flex; }
		.li{color: rgb(102, 102, 102); font-size: 16px; font-weight: bold; margin-right: 0.3rem; }
		.liact{ font-size: 20px; color: rgb(30, 30, 30); font-weight: bold; background: url('http://test91.91haoka.cn/1715304099tw650481.jpg') no-repeat center;}
    </style>
	<body>
        <div id="app" style="background: #FFFFFF;" v-cloak>
             <div style="position: relative;">
               <div class="kflexcc">
                 <img src="http://test91.91haoka.cn/1715235383dio50481.jpg" style="width: 0.93rem; margin-top: 0.38rem;">
               </div>
               <div style="text-align: center; color: rgb(51, 51, 51); font-size: 18px; font-weight: 700; margin: 0.15rem 0 0.1rem;">下单成功</div>
               <div style="font-size: 12px; color: rgb(153, 153, 153); text-align: center;">{{ruleForm.order_word}}</div>
               <div @click="go2()" style="border-radius: 0.44rem; font-size: 18px; box-shadow: 0px 2px 22px 0px rgba(255, 0, 89, 0.18);background: rgb(255, 6, 57); color: #fff; width: 3.15rem; margin: 0.3rem auto; margin-bottom: 0.9rem; line-height: 0.44rem; text-align: center;">查看订单</div>
               <div class="kflexcc" v-if="ruleForm.order_qrcode"><img :src="ruleForm.order_qrcode" style="width: 2rem; padding: 0.2rem; box-shadow: 0px 3px 20px 0px rgba(200, 215, 234, 0.4);  border-radius: 10px;"></div>
               <div style="font-size: 12px; color: rgb(153, 153, 153); margin-top: 0.2rem; text-align: center;">{{ruleForm.qrcode_description}}</div>
               <div style="font-size: 12px; color: rgb(153, 153, 153); margin-top: 0.05rem; text-align: center;">{{ruleForm.order_kf_contact_way}}</div>
             </div>
        </div>

       
        <script>
            var h = document.documentElement.clientWidth / 3.75 + 'px';
                document.documentElement.style.fontSize = h;

            
            new Vue({
                el: '#app',
                data: function() {
                	return {
						ruleForm:{},
						apis:"/apis"
                	}
                },
                created(){
					if(location.host != 'localhost'){
						this.apis = ""
					}
					axios.get(this.apis + '/api/plan-market/order-page/web/mini-store/info?shop_id='+this.getUrlParam('shop_id'))
						.then(response => {
							if (response.data.msg.code == 0) {
								this.ruleForm = response.data.data
								document.title = this.ruleForm.name
							} else {
								vant.Toast(response.data.msg.info);
							}
						})
					
					
                },
                mounted () {
                   
                },
                methods:{
					getUrlParam:function(name) {
					    var query = window.location.search.substring(1);
					    var vars = query.split("&");
					    for (var i=0;i<vars.length;i++) {
					            var pair = vars[i].split("=");
					            if(pair[0] == name){return pair[1];}
					    }
					    return(false);
					},
					
					go2:function(){
						
						window.location.href = decodeURIComponent(this.getUrlParam('url')) 
					}
                }
            });

  
        </script>
	</body>
</html>
